/* eslint no-unused-vars:0 */
import React from 'react';
import './index.less';
import {
    Card,
    Form,
    Input,
    Button,
    message,
    Icon,
    Checkbox,
    Radio,
    InputNumber,
    Select,
    Switch,
    DatePicker,
    Upload
} from 'antd';
import moment from 'moment/moment';

const FormItem = Form.Item;
const RadioGroup = Radio.Group;
const Option = Select.Option;

class Download extends React.Component {
    state = {
        total: 1000,
        idList: []
    };

    componentDidMount() {
        console.log(localStorage.getItem('idList'));
        this.setState({
            idList: localStorage.getItem('idList')
        });
    }

    //获取值
    handleSubmit = (e) => {
        //state中的idList是逗号分割的字符串，需要先分割
        var idList = this.state.idList.split(',');
        this.props.form.validateFields((err, values) => {
            if (!err) {
                if (values.choose == 1) idList = [];
                var fileName = 'downloadFile';
                if (values.format == 0) fileName += '.doc';
                else if (values.format == 1) fileName += '.xls';
                else if (values.format == 2) fileName += '.pdf';
                else if (values.format == 3) fileName += '.rtf';
                else if (values.format == 4) fileName += '.txt';

                this.$post('/trends/export/download', {
                    idList: idList,
                    type: values.range,
                    format: values.format
                })
                    .then((res) => {
                        // console.log('res:', res)
                        if (res) {
                            console.log('success');
                        }
                        console.log(res);

                        let content = res;
                        // 组装a标签
                        let elink = document.createElement('a');

                        // // 设置下载文件名
                        elink.download = fileName;
                        elink.style.display = 'none';
                        let blob = new Blob([content]);

                        elink.href = URL.createObjectURL(blob);

                        document.body.appendChild(elink);
                        elink.click();
                        document.body.removeChild(elink);
                    })
                    .catch((e) => {
                        console.log('error');
                    });
            }
        });
    };

    render() {
        const radioStyle = {
            display: 'block',
            height: '30px',
            lineHeight: '38px'
        };
        const { getFieldDecorator } = this.props.form; //form是个对象
        //响应式布局
        const formItemLayout = {
            labelCol: {
                xs: 24,
                sm: 3
            },
            wrapperCol: {
                xs: 24,
                sm: 5
            }
        };

        return (
            <Card title="下载文章" bordered="true" className="download-card">
                <Form layout="horizontal">
                    <FormItem label="选择文章" {...formItemLayout}>
                        {getFieldDecorator('choose', {
                            initialValue: '1'
                        })(
                            <RadioGroup>
                                <Radio style={radioStyle} value="1">
                                    所有文章({this.state.total})
                                </Radio>
                                <Radio style={radioStyle} value="2">
                                    已选文章
                                </Radio>
                                <Radio style={radioStyle} value="3">
                                    自选文章&nbsp;
                                    <Input />
                                </Radio>
                            </RadioGroup>
                        )}
                    </FormItem>
                    <span className="Download-mention">
                        (每次最多下载1000份文章)
                    </span>
                    <FormItem
                        label="下载范围:"
                        defaultValue="标题及内文"
                        {...formItemLayout}>
                        {getFieldDecorator('range', {
                            initialValue: '1'
                        })(
                            <Select>
                                <Option value="0">标题</Option>
                                <Option value="1">内文</Option>
                            </Select>
                        )}
                    </FormItem>
                    <FormItem
                        label="格式:"
                        defaultValue="PDF文字文件"
                        {...formItemLayout}>
                        {getFieldDecorator('format', {
                            initialValue: '4'
                        })(
                            <Select>
                                <Option value="0">WORD文字文件</Option>
                                <Option value="1">EXCEL文字文件</Option>
                                <Option value="2">PDF文字文件</Option>
                                <Option value="3">RTF文档</Option>
                                <Option value="4">纯文字文件</Option>
                            </Select>
                        )}
                    </FormItem>
                    {/* <FormItem style={{marginLeft:'100px'}}>
                        {
                            getFieldDecorator('mark' )(

                            )
                        }
                    </FormItem>*/}
                    <FormItem style={{ marginLeft: '110px' }}>
                        <Button>取消</Button>
                        <Button type="primary" onClick={this.handleSubmit}>
                            下载
                        </Button>
                    </FormItem>
                </Form>
            </Card>
        );
    }
}
export default Form.create()(Download);
